{extend name="Public:main"}
{block name="style"}
<link href="__STATIC__/admin/css/login.css" rel="stylesheet">
<style type="text/css" >
    body{
        -moz-background-size:100% 100%; background-size:100% 100%;
    }
    button{
        width:220px;
    }
    .vcode{width:220px;}
</style>
<script>
    if (window.top !== window.self) {
        window.top.location = window.location;
    }
</script>
{/block}
{block name="bodyTag"}
<body>
<div class="main-login">
    <div class="main-login-form">
        <form id="login" method="post" action="{:url('admin/login/index')}">
        {:token()}
        <div class="title">	</div>
        <table width="100%">
            <tr>
                <th>帐号:</th>
                <td><input type="text" class="user uname len220" name="username" placeholder="请输入用户名" /></td>
            </tr>
            <tr>
                <th>密码:</th>
                <td><input type="password" class="pass pword len220" name="password" placeholder="请输入密码" /></td>
            </tr>
            <tr>
                <th>验证码:</th>
                <td class="code yzm_parent"><input type="text" class="code yzm len220" name="verify"  placeholder="请输入验证码"/></td>
            </tr>
            <tr>
                <th>&nbsp;</th>
                <td class="code-img"><img src="{:captcha_src()}" id="verifyImg" class="pointer vcode" /></td>
            </tr>
            <tr>
                <td colspan="2" style="padding-left:107px;"><button class="sub">登　　录</button></td>
            </tr>
        </table>


        <!--<div class="war-log-form">-->
            <!--<div class="form-div user">-->
                <!--<input type="text" class="user uname" name="username" placeholder="请输入用户名" />-->
            <!--</div>-->
            <!--<div class="form-div pass">-->
                <!--<input type="password" class="pass pword m-b" name="password" placeholder="请输入密码" />-->
            <!--</div>-->
            <!--<div class="form-div code yzm_parent">-->
                <!--<input type="text" class="code yzm" name="verify"  placeholder="请输入验证码"/>-->
                <!--<div class="code-img"><img src="{:captcha_src()}" id="verifyImg" class="pointer" /></div>-->
            <!--</div>-->
            <!--<div class="form-div-p"></div>-->
            <!--<div class="form-submit">-->
                <!--<button class="sub">登录</button>-->
            <!--</div>-->
        <!--</div>-->
        </form>
    </div>
</div>
{block name="script" }
<script src="__STATIC__/admin/js/jquery.min.js?v=2.1.4"></script>
<script src="__STATIC__/admin/bootstrap/js/bootstrap.min.js?v=3.3.7"></script>
<script src="__STATIC__/admin/plugins/layer/layer.min.js"></script>
<script src="__STATIC__/admin/js/jquery.common.js"></script>
<!-- jQuery Validation plugin javascript-->
<script src="__STATIC__/admin/plugins/validate/jquery.validate.min.js"></script>
<script src="__STATIC__/admin/plugins/validate/messages_zh.min.js"></script>
<script src="__STATIC__/admin/plugins/validate/form-validate-com.js"></script>
<!--[if lt IE 10]>
<script src="__STATIC__/admin/js/placeholder.js"></script>
<![endif]-->
<script type="text/javascript">
    sessionStorage.removeItem('login_errorPlacement');
    $('#verifyImg').click(function(){
        $("#verifyImg").attr("src","{:captcha_src()}?&t="+Date.parse(new Date()));
    })
    $('.sub').click(function(){
        sessionStorage.removeItem('login_errorPlacement');
    })
    //表单提交
    $('#login').validate({
        //debug:true, //自验证，不提交表单
        rules:{
            username:{
                required:true,
                minlength:5,
                maxlength:15,
            },
            password:"required",
            verify:{
                required:true
            }
        },
        messages:{
            username:{
                required: '请输入用户名',
                minlength: '用户名至少 5 个但不超过 15 个字符',
                maxlength: '用户名至少 5 个但不超过 15 个字符',
            },
            password: '请输入密码',
            verify:{
                required: '请输入验证码',
                digits: '验证码输入不正确',
            }
        },
        errorPlacement:function(error, element){
            if(sessionStorage.getItem('login_errorPlacement') == 1) return false;
            error.each(function (i, ob) {
                ob.innerHTML != '' && layer.msg(ob.innerHTML);
                sessionStorage.setItem('login_errorPlacement', 1);
            })
        },
        submitHandler: function(form){
            $.ajax({
                type: $('#login').attr("method"),
                url: $("#login").attr("action"),
                data: $("#login").serialize(),
                dataType:"json",
                beforeSend: function(request){
                    request.setRequestHeader("token", $("#login").find("input[name='__token__']").val());
                    load_index = parent.layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
                },
                success: function(data){
                    parent.layer.close(load_index);
                    if(data.header && data.header.token){
                        $("#login").find("input[name='__token__']").val(data.header.token);
                    }
                    if(data.code != 200){
                        $("#verifyImg").attr("src","{:captcha_src()}?&t="+Date.parse(new Date()));
                        layer.msg(data.msg);
                    } else {
                        //进行跳转
                        window.location.href = '{:url("admin/index/index")}';
                        //$.Oa.href('{:url("admin/index/index")}');
                    }
                },
                error: function(data){
                    layer.msg(data.responseText);
                }
            })
        }
    })
    //回车键提交
    $('#login').keydown(function(e){
        var e = e || event,
            keycode = e.which || e.keyCode;
        if(keycode == 13){
            $(".sub").trigger('click');
        }
    })
</script>
{/block}
</body>
{/block}